<wicket:extend>
	<div class="content">
		<div class="container">
			<!-- <div class="page-header">
        <h1>The BP Circles frequently asked questions</h1>
      </div>  -->
			<div class="row">
				<!-- <div class="span2"></div>  bs-docs-sidenav affix nav-tabs nav-stacked-->
				<div class="span2">

					<div class="smv-leftnav">
						<div class="btn-toolbar">
							<div class="btn-group">
								<a class="btn btn-small btn-success" href="#">Take Ride</a> <a
									class="btn btn-small" href="#">Give Ride</a>
							</div>
						</div>
						<div class="well" style="padding: 8px 0;">
							<ul class="nav nav-list">
								<li class="nav-header">Ride Section</li>
								<li><a href="#" wicket:id="newRides"><i class="icon-edit"></i>
										New Rides</a></li>
								<li><a href="#" wicket:id="pendingRides"><i
										class="icon-share"></i> Pending Rides</a></li>
								<li><a href="#" wicket:id="completedRides"><i
										class="icon-check"></i> Completed Rides</a></li>
								<li><a href="#" wicket:id="payment"><i class="icon-shopping-cart"></i>
										Payment</a></li>
								<li class="nav-header">Your Account</li>
								<li><a href="#" wicket:id="userPreferences"><i class="icon-user"></i>
										Preferences</a></li>
								<li><a href="#" wicket:id="createCircle"><i class="icon-cog"></i>
										Create Circle</a></li>
								<li><a href="gr-create-msg.html"><i
										class="icon-comment"></i> Create Message</a></li>
								<li class="active"><a href="#" wicket:id="home"><i
										class="icon-envelope"></i> My Message</a></li>

							</ul>
						</div>
					</div>
				</div>
				<!-- table section -->
				<div class="span10">
					<div class="page-header">
						<h1>Create Circle</h1>
					</div>
					<div class="row">
						<div class="span10">
							<form class="form-horizontal">
								<div class="control-group">
									<label class="control-label" for="inputEmail">Circle
										Name</label>
									<div class="controls">
										<input type="text" class="input-xlarge" id="inputEmail"
											placeholder="Circle Name">
									</div>
								</div>
								<div class="control-group">
									<label class="control-label" for="inputPassword">Description</label>
									<div class="controls">
										<textarea rows="2" class="input-xlarge"></textarea>
									</div>
								</div>

								<div class="control-group">
									<div class="controls">
										<label class="checkbox"> <input type="checkbox">
											Shared taxi ok?
										</label>
									</div>
								</div>
								<div class="control-group">
									<label class="control-label" for="inputEmail">Taxi
										Provider</label>
									<div class="controls">
										<select class="input-xlarge">
											<option>Taxi 1</option>
											<option>Taxi 2</option>
											<option>Taxi 3</option>
											<option>Taxi 4</option>
											<option>Taxi 5</option>
										</select>
									</div>
								</div>
								<div class="control-group">
									<div class="controls">
										<button type="submit" class="btn btn-success btn-large">Create
											Circle</button>
									</div>
								</div>
							</form>
						</div>

					</div>
				</div>
				<!-- table section ends here -->
			</div>
		</div>
	</div>
	<br />
	<br />
	<br />
	<br />
</wicket:extend>